import { ChangeEvent, useCallback, useEffect, useState } from 'react'
import { useLocation } from 'react-router-dom'
import { Form, message } from 'antd'
import { exportData, isNullArray, isNullData } from '@/utils'
import { deportDataExportDetails, getCityList, getGoBack } from '../service'
import { TableInfo, AreaList, ReportDetailsHook } from '../data'
import { CardList } from '@/@types'
import { getRoleAreaList } from '@/services/common'
import { getStorage } from '@/utils/storage'

// 参数类型
export interface LocationParams {
  cityId: number // 城市id
  task: string[]
}

export default (): ReportDetailsHook => {
  // 页面跳转过来的参数
  const location = useLocation()
  const state = (location.state as LocationParams) || getStorage('preview')
  // 卡片信息
  const [cardList, setCardList] = useState<CardList[]>([])
  const [rejectForm] = Form.useForm()
  // modal
  const [isModalOpen, setIsModalOpen] = useState<boolean>(false)
  // 当前选中任务
  const [seleteTask, setSeleteTask] = useState<string[]>(state.task)
  // 地区
  const [areaList, setAreaList] = useState<AreaList[]>([])
  // 存放状态
  const [status, setStatus] = useState<string>('')
  // 表格数据
  const [tableList, setTableList] = useState<TableInfo[]>([])
  // 存放医院名称
  const [hospitalName, setHospitalName] = useState<string>('')
  // 存放勾选的表格信息
  const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([])
  // 存放选中地区
  const [area, setArea] = useState<number>(state.cityId)
  // loading
  const [loading, setLoading] = useState<boolean>(false)
  // 退回id
  const [returnReasonInfo, setReturnReasonInfo] = useState<TableInfo>()

  // 查询表格信息
  const getTableInfo = async () => {
    setLoading(true)
    const res = await getCityList({
      hospitalName,
      dataReportQuarter: seleteTask[1] ? seleteTask[1] : '',
      dataReportYear: seleteTask[0] ? seleteTask[0] : '',
      cityId: area,
      reportStatus: status,
    })
    if (isNullData(res) && res.data && isNullArray(res.data)) {
      setCardList(res.data.dataEscalationHeads)
      setTableList(res.data.dataEscalationHospitalSearchVOs)
    } else {
      setCardList([])
      setTableList([])
    }
    setLoading(false)
  }

  // 获取地区
  const getAreaList = useCallback(async () => {
    const res = await getRoleAreaList()
    if (isNullData(res) && res.data && isNullArray(res.data)) {
      const newlist = res.data.map((item) => ({ value: item.id, label: item.name }))
      // console.log('newlist🚀🚀🚀🚀', newlist)
      setAreaList(newlist)
    } else {
      setAreaList([])
    }
  }, [])

  // 退回操作
  const goBack = async (record: TableInfo) => {
    setReturnReasonInfo(record)
    setIsModalOpen(true)
  }

  // 关闭modal
  const handleCancelModal = () => {
    setIsModalOpen(false)
    setReturnReasonInfo(undefined)
    rejectForm.resetFields()
  }

  // 原因提交
  const onFinish = async (values: { returnReason: string }) => {
    const res = await getGoBack({
      dataReportQuarter: seleteTask[1] ? seleteTask[1] : '',
      dataReportYear: seleteTask[0] ? seleteTask[0] : '',
      hospitalId: returnReasonInfo?.hospitalId,
      returnReason: values.returnReason,
    })
    if (isNullData(res) && res.data && isNullArray(res.data) && res.data.success === 200) {
      message.success('退回成功')
      handleCancelModal()
      getTableInfo()
    } else {
      message.error(res.data?.message)
    }
  }

  // 任务下拉框变化时触发
  const handleTaskChange = useCallback((e: string[]) => {
    setSeleteTask(e)
  }, [])

  // 地区发生变化时触发
  const handleAreaChange = useCallback((e: number) => {
    console.log('e🚀🚀🚀🚀', e)
    setArea(e)
  }, [])

  // 医院名称发生变化
  const handleHospitalChange = useCallback(({ target: { value } }: ChangeEvent<HTMLInputElement>) => {
    setHospitalName(value)
  }, [])

  // 表格勾选触发
  const onSelectChange = useCallback((newSelectedRowKeys: React.Key[]) => {
    console.log('selectedRowKeys changed: ', newSelectedRowKeys)
    setSelectedRowKeys(newSelectedRowKeys)
  }, [])

  // 导出
  const exportDocument = async () => {
    const res = await deportDataExportDetails({
      hospitalName,
      dataReportQuarter: seleteTask[1] ? seleteTask[1] : '',
      dataReportYear: seleteTask[0] ? seleteTask[0] : '',
      cityId: area,
      reportStatus: status,
    })
    exportData(res, `${seleteTask[0]}年第${seleteTask[1]}季度数据`, 'xlsx')
    message.success('导出成功')

    console.log('res🚀🚀🚀🚀', res)
  }

  // 状态下拉框
  const handleStatusChange = useCallback((e: string) => {
    setStatus(e)
  }, [])

  useEffect(() => {
    getAreaList()
  }, [])

  useEffect(() => {
    getTableInfo()
  }, [area, status, seleteTask])

  return {
    cardList,
    seleteTask,
    areaList,
    handleTaskChange,
    handleAreaChange,
    tableList,
    selectedRowKeys,
    onSelectChange,
    handleStatusChange,
    handleHospitalChange,
    hospitalName,
    status,
    area,
    getTableInfo,
    goBack,
    loading,
    state,
    exportDocument,
    isModalOpen,
    handleCancelModal,
    rejectForm,
    onFinish,
  }
}
